<template>
  <el-drawer v-model="drawerProps.isView" :destroy-on-close="true" size="30%" :title="`${drawerProps.title}`">
    <div>
      <el-form-item label="是否按章节整理：">
        <el-switch v-model="with_chapter" />
      </el-form-item>
      <div class="upload-list">
        <UploadAndExportDocx :image-url="image_url" :file-size="3" :api="exportWord">
          <template #tip> 上传文件最大为 3M </template>
        </UploadAndExportDocx>
      </div>
    </div>
  </el-drawer>
</template>

<script setup lang="ts" name="exportQuestionsBatchDrawer">
import { reactive, ref } from "vue";
import { addQuestionBatchApi } from "@/api/modules/bank_question";
import { ElMessage } from "element-plus";
import { TableColumnCtx } from "element-plus/es/components/table/src/table-column/defaults";
import { exportWordApi } from "@/api/modules/question";
import UploadAndExportDocx from "@/views/question/uploadAndExportDocx.vue";

const image_url = ref("");
const drawerProps = ref<any>({
  isView: false,
  title: "",
  row: {}
});

const getBankListParams = ref<any>({
  course_id: 0
});

// 接收父组件传过来的参数
const acceptParams = (params: any) => {
  drawerProps.value = params;
  getBankListParams.value = {
    course_id: params.course_id
  };
  console.log("getBankListParams.value: " + JSON.stringify(getBankListParams.value));
};
const with_chapter = ref<boolean>(false);

// 提交数据（新增/编辑）
const handleSubmit = async (row: any, column: TableColumnCtx<any>) => {
  if (column.property == "radio" || column.property == "operation") return;
  try {
    const params = {
      bank_id: row.bank_id,
      questions: drawerProps.value.selectedList
    };
    const data = await addQuestionBatchApi(params);
    if (data.code !== "") {
      ElMessage.error(data.msg);
      return;
    }
    ElMessage.success({ message: `提交成功！` });
    drawerProps.value.isView = false;
  } catch (error) {
    console.log(error);
  }
  return true;
};

const exportWord = (params: FormData) => {
  let question_ids = [];
  for (let row of drawerProps.value?.questionTableData) {
    question_ids.push(row.question_id);
  }
  params.append("question_ids", JSON.stringify(question_ids));
  params.append("course_id", drawerProps.value.course_id);
  params.append("with_chapter", with_chapter.value.toString());
  return exportWordApi(params);
};
defineExpose({
  acceptParams
});
</script>
<style scoped lang="scss">
@import "addQuestionsBatchDrawer";
</style>
